<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>发布社招</title>
    <!-- 引入通用css -->
    <link rel="stylesheet" href="../common/public.css" />
    <!-- vue -->
    <script src="../common/js/vue2.js"></script>
    <!-- 引入http-vue-loader -->
    <script src="../common/js/vueLoader.js"></script>
    <!-- 引入样式vant -->
    <script src="../common/ui/vant-ui/ui.js"></script>
  </head>
  <body>
    <div id="app">
      <main-top></main-top>
      <div class="mainCenter">
        <div class="leftContent">
          <!-- 顶部 -->
          <top class="ndis500"></top>
          <!-- 提示 -->
          <div class="alart flex jcsb">
            <div>试试电脑端快速发布</div>
            <div class=""><van-icon name="arrow" size="20" /></div>
          </div>
          <div>
            <!-- 主体 -->
            <div class="pd20">
              <div class="flex jcsb aic mgb20">
                <h2>发布社招</h2>
                <div class="flex aic">
                  <div><van-icon name="exchange" /></div>
                  <div>切换招聘类型</div>
                </div>
              </div>
              <steps num="1"></steps>
              <ucell :tipData="fromData"></ucell>
            </div>
          </div>
          <ubtn-footer :ck="next" btntxt="下一步"></ubtn-footer>
          
        </div>
        <lan-adright></lan-adright>
      </div>
      <main-footer></main-footer>
    </div>
  </body>
</html>
<style>
  .alart {
    background-color: rgb(153, 253, 144);
    padding: 14px;
    color: rgb(82, 185, 42);
  }
  @media (min-width:500px){
    .alart{
      border-radius: 10px;
    }
  }
</style>
<script>
  Vue.use(httpVueLoader);
  new Vue({
    el: "#app",
    data: {
      active: 1,
      fromData: [
        { name: "职位名称", msg: '请填写职位名称,如"销售专员"', value: "" },
        { name: "职位描述", msg: "介绍工作内容,职位要求,加分项", value: "" },
        {
          name: "职位类型",
          msg: "介绍工作内容,职位要求,加分项",
          value: "Android",
          bMsg: "注:职位名称,职位类型和工作城市发布后不可修改.",
        },
      ],
    },
    components: {
      top: httpVueLoader("../common/commpent/top.vue"),
      // ufooter: httpVueLoader("../common/commpent/ufooter.vue"),
      ucell: httpVueLoader("../common/commpent/ucell.vue"),
      steps: httpVueLoader("../common/commpent/steps.vue"),
      "ubtn-footer": httpVueLoader("../common/commpent/ubtn/footer.vue"),
      "main-top": httpVueLoader("../common/commpent/main/workTop.vue"),
      "main-footer": httpVueLoader("../common/commpent/main/mainFooter.vue"),
      "lan-adright": httpVueLoader("../common/commpent/lan/adRight.vue"),
    },
    methods: {
      next() {
        window.location.href = "./resume.html";
      },
      showPicker(index) {
        console.log(index);
      },
    },
  });
</script>
